<template>
  <div>
    <el-dialog
      title="工况详情"
      :visible.sync="dialogVisible"
      width="70%">
      <div style="height: 350px;">
        <template>
          <el-table
            ref="multipleTable"
            :data="tableData"
            tooltip-effect="dark"
            style="width: 100%"
            border
            height="calc(100% - 1px)"
            :header-cell-style="{background:'#f5f5f5','text-align':'center'}">
            <template slot="empty">
              <el-empty description="暂无数据"></el-empty>
            </template>
            <el-table-column
              label="采集设备"
              prop="iotSourceName">
            </el-table-column>
            <el-table-column
              prop="itemTag"
              label="测点标识"
             >
            </el-table-column>
            <el-table-column
              prop="itemName"
              label="测点名称"
              >
            </el-table-column>
            <el-table-column
              label="测点地址"
              prop="dataAddress">
            </el-table-column>
            <el-table-column
              prop="dataRate"
              label="倍率"
              align="right">
            </el-table-column>
            <el-table-column
              prop="itemGroup"
              label="测点分组"
              align="center">
              <template #default="{row}">
                <span>{{ xlalalist.find(ele=>ele.value==row.itemGroup).text }}</span>
              </template>
            </el-table-column>
            <el-table-column
              prop="address"
              label="操作"
              align="center" >
              <template #default="{row}">
                <el-tooltip class="item" effect="dark" content="修改" placement="top-end">
                  <span @click="putlists(row)"><i class="el-icon-edit" style="color: skyblue; margin-left: 15px; cursor: pointer;"></i ></span>
                </el-tooltip>
                <el-tooltip class="item" effect="dark" content="删除" placement="top-end">
                  <span @click="dellist(row)"><i class="el-icon-delete" style="color: red; margin-left: 15px; cursor: pointer;"></i></span>
                </el-tooltip>
                <el-tooltip class="item" effect="dark" content="上移" placement="top-end">
                  <span @click="shangyi(row)"><i class="el-icon-upload2" style="color: skyblue; margin-left: 15px;cursor: pointer;"></i></span>
                </el-tooltip>
                <el-tooltip class="item" effect="dark" content="下移" placement="top-end">
                  <span @click="xiayi(row)"><i class="el-icon-download" style="color: skyblue; margin-left: 15px;cursor: pointer;"></i></span>
                </el-tooltip>
              </template>
            </el-table-column>
          </el-table>
        </template>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false" size="small">取 消</el-button>
      </span>
    </el-dialog>
        <!-- 批量修改遥信数据类型组件 -->
        <DialogYaoxin
    ref="dialogyaoxin"
    :changeselect="changeselect"
    :flag="'flag'"
    @shuxing="shuxing"
    ></DialogYaoxin>
  </div>
</template>

<script>
import { getshebeilistapi, dellistapi, postshangyiapi, postxiayiapi } from '@/api/iot'
import DialogYaoxin from '../iot/YaoXin/index.vue'
export default {
  name: 'CallPoliceGongKuang',
  components: {
    DialogYaoxin
  },
  props: {
    treevalue: {
      type:Object
    }
  },
  data() {
    return {
      dialogVisible:false,
      tableData: [],
      xlalalist: [{ value: '0', text: '工况遥信' }],
      changeselect:[]
    };
  },

  mounted() {
    
  },

  methods: {
    // 获取表格数据
    async getshebeilist (deviceId) {
      const res = await getshebeilistapi({ deviceId: deviceId, itemGroup:'0' })
      this.tableData = res.data.list
    },
    // 刷新
    shuxing () {
      this.getshebeilist(this.treevalue.deviceId, '0')
    },
    // 修改
    putlists (row) {
      this.changeselect = [row]
        this.$refs.dialogyaoxin.dialogVisible = true
    },
    // 删除
    dellist (row) {
      this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
          await dellistapi({ id: row.id })
        this.getshebeilist(this.treevalue.deviceId, '0')
        this.$message.success('删除成功')
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    // 上移
    async shangyi(row) {
      await postshangyiapi({ id: row.id }).then(res => {
        this.$message({
          type: res.code == '200' ? 'success' : 'warning',
          message:res.code=='200'?'上移成功':res.message
        })
      })
      this.getshebeilist(this.treevalue.deviceId, '0')
    },
    // 下移
    async xiayi(row) {
      await postxiayiapi({ id: row.id }).then(res => {
        this.$message({
          type: res.code == '200' ? 'success' : 'warning',
          message:res.code=='200'?'下移成功':res.message
        })
      })
      this.getshebeilist(this.treevalue.deviceId, '0')
    },
  },
};
</script>

<style  scoped>

</style>